import { useSelector, useDispatch } from 'umi';
import Input from './components/Input';
import Form from './components/Form';

import style from './index.less';

const Todolist = () => {
  const count = useSelector((state: any) => state.todolist.count);
  const dispatch = useDispatch();

  return (
    <>
      <h3>todolit</h3>
      <button onClick={() => dispatch({ type: 'todolist/minus', num: 2 })}>
        -
      </button>
      <span>{count}</span>
      <button onClick={() => dispatch({ type: 'todolist/addAsync' })}>+</button>

      <div className={style.wrap}>
        <Input />
        <Form />
      </div>
    </>
  );
};

export default Todolist;
